<?
session_start();
include('../config.php');
require_once('../classes/class.jira.php');
include("../classes/connect.php");
ini_set('display_errors', 'On');

?>

<!DOCTYPE html>
<html>
<head>
    <title>Date axis</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" >

    <link href="examples/content/shared/styles/examples-offline.css" rel="stylesheet">
    <link href="styles/kendo.dataviz.min.css" rel="stylesheet">
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
    <link href="../css/demo.css" rel="stylesheet">

    <script src="js/jquery.min.js"></script>
    <script src="js/kendo.dataviz.min.js"></script>
    <script src="examples/content/shared/js/console.js"></script>
	<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
</head>
<body>
	<div class="repfromdate">
    <p>From: <input type="text" id="fromdatepicker"/></p>
	</div>
	<div class="reptodate">
	<p>To: <input type="text" id="todatepicker"/></p>
	</div>
	<div class="repsubmit">
	<input type="button" value="submit" onclick="datecheck();"/>
	</div>
        <div id="example" class="k-content">
            <div class="configuration k-widget k-header" style="width:170px;">
                <span class="configHead">Base date unit</span>
                <ul class="options">
                    <li>
                        <input id="baseUnitAuto" name="baseUnit"
                                type="radio" value="" autocomplete="off" />
                        <label for="baseUnitAuto">Automatic (default)</label>
                    </li>
                    <li>
                        <input id="baseUnitYears" name="baseUnit"
                                type="radio" value="years" autocomplete="off" />
                        <label for="baseUnitYears">Years</label>
                    </li>
                    <li>
                        <input id="baseUnitMonths" name="baseUnit"
                                type="radio" value="months" checked="checked" autocomplete="off" />
                        <label for="baseUnitMonths">Months</label>
                    </li>
                    <li>
                        <input id="baseUnitWeeks" name="baseUnit"
                                type="radio" value="weeks" autocomplete="off" />
                        <label for="baseUnitWeeks">Weeks</label>
                    </li>
                    <li>
                        <input id="baseUnitDays" name="baseUnit"
                                type="radio" value="days" autocomplete="off" />
                        <label for="baseUnitDays">Days</label>
                    </li>
                </ul>
            </div>
            <div class="chart-wrapper">
                <div id="chart"></div>
            </div>
			
<script>
 $(function() {
	$( "#fromdatepicker" ).datepicker({ maxDate: "-1d" });
	$( "#todatepicker" ).datepicker({ maxDate: "0d" });
	});
	function datecheck(){
		var fromdate=$( "#fromdatepicker" ).datepicker( "getDate" );;
		var todate=$( "#todatepicker" ).datepicker( "getDate" );
		
		var fromdatestr=$.datepicker.formatDate('yy/mm/dd', fromdate);
		var todatestr=$.datepicker.formatDate('yy/mm/dd', todate);
				
		if(fromdate==null || todate==null){
			alert('Please Enter a valid date');
		}
		var dates= new Array();
		while(fromdate<=todate){
			var current=$.datepicker.formatDate('yy/mm/dd', fromdate);
			// alert(current);
			dates.push(new Date(current));						
			fromdate.setDate(fromdate.getDate()+1);					
		}
		$.ajax({
		  url: 'ajax.php?fromdate='+fromdatestr+'&todate='+todatestr,
		  dataType:'json'
		}).done(function(json) {  
		   var OpenCV = new Array();
		   var ShortListed = new Array();
		   var Interviewed = new Array();
		   var Tested = new Array();
		   var Selected = new Array();
		   var Rejected = new Array();
		   var Offered = new Array();
		   var InterviewCalled = new Array();
		   var TestCalled = new Array();
		   var FinalInterviewCalled = new Array();
		   var FinalInterviewed = new Array();
		   var Joined = new Array();		
		   
		   for(index=0;index<dates.length;index++){
			   var COpenCV = 0;
			   var CShortListed = 0;
			   var CInterviewed = 0;
			   var CTested = 0;
			   var CSelected = 0;
			   var CRejected = 0;
			   var COffered = 0;
			   var CInterviewCalled = 0;
			   var CTestCalled = 0;
			   var CJoined = 0;
			   var CFinalInterviewCalled = 0;
			   var CFinalInterviewed = 0;
			   
			   var currentdate = (+dates[index])/1000;
			   var currentdate2 = dates[index];			   
			   var nextday = new Date($.datepicker.formatDate('yy/mm/dd', currentdate2));
			   nextday = nextday.setDate(nextday.getDate()+1);
			   nextday = (+nextday)/1000;
			 $.each(json , function(i,element) { 
                             console.log(element);
                                return false;
				if((element[0] < nextday  && element[1] == 'null' && element[5] == 'null') || (element[0] < nextday && (element[5] > nextday || element[1] > nextday))){
					COpenCV++;
				}
				if((element[1] < nextday  && element[7] == 'null' && element[8] == 'null' && element[5] == 'null') || (element[1] < nextday && (element[7] > nextday || element[8] > nextday || element[5] > nextday))){
					CShortListed++;
				}
				if((element[2] < nextday  && element[8] == 'null' && element[4] == 'null' && element[5] == 'null') || (element[2] < nextday && (element[8] > nextday || element[4] > nextday || element[5] > nextday))){
					CInterviewed++;
				}
				if((element[3] < nextday  && element[4] == 'null' && element[5] == 'null' && element[10] == 'null') || (element[3] < nextday && (element[4] > nextday || element[5] > nextday || element[10] > nextday))){
					CTested++;
				}
				if((element[4] < nextday  && element[5] == 'null' && element[6] == 'null') || (element[4] < nextday && (element[5] > nextday || element[6] > nextday))){
					CSelected++;
				}
				if((element[5] < nextday ) || (element[5] < nextday)){
					CRejected++;
				}
				if((element[6] < nextday  && element[4] == 'null' && element[5] == 'null') || (element[6] < nextday  && (element[4] > nextday || element[5] > nextday))){
					COffered++;
				}
				if((element[7] < nextday  && element[2] == 'null' && element[5] == 'null') || (element[7] < nextday  && (element[2] > nextday || element[5] > nextday))){
					CInterviewCalled++;
				}
				if((element[8] < nextday  && element[3] == 'null' && element[5] == 'null') || (element[8] < nextday  && (element[3] > nextday || element[5] > nextday))){
					CTestCalled++;
				}
				if((element[9] < nextday) || (element[9] < nextday)){
					CJoined++;
				}
				if((element[10] < nextday  && element[11] == 'null' && element[5] == 'null') || (element[10] < nextday  && (element[11] > nextday || element[5] > nextday))){
					CFinalInterviewCalled++;
				}
				if((element[11] < nextday  && element[4] == 'null' && element[5] == 'null') || (element[11] < nextday  && (element[4] > nextday || element[5] > nextday))){
					CFinalInterviewed++;
				}
				
			 });
			 OpenCV.push(COpenCV);
			 ShortListed.push(CShortListed);
			 Interviewed.push(CInterviewed);
			 Tested.push(CTested);
			 Selected.push(CSelected);
			 Rejected.push(CRejected);
			 Offered.push(COffered);
			 InterviewCalled.push(CInterviewCalled);
			 TestCalled.push(CTestCalled);
			 Joined.push(CJoined);
			 FinalInterviewCalled.push(CFinalInterviewCalled);
			 FinalInterviewed.push(CFinalInterviewed);
		   }
			createChart(dates,OpenCV,ShortListed,Interviewed,Tested,Selected,Rejected,Offered,InterviewCalled,TestCalled,FinalInterviewCalled,FinalInterviewed,Joined);
		});
		
		
	}	
        
	function createChart(dates,OpenCV,ShortListed,Interviewed,Tested,Selected,Rejected,Offered,InterviewCalled,TestCalled,FinalInterviewCalled,FinalInterviewed,Joined) {
		$("#chart").kendoChart({
			theme: $(document).data("kendoSkin") || "default",
			title: {
				text: "Statuses and No of applications"
			},
			series: [{
				type: "line",
				data: OpenCV,
				color: "#000066",
				name: "OpenCV"
			}, {
				type: "line",
				data: ShortListed,
				color: "#0033FF",
				name: "ShortListed"
			},{
				type: "line",
				data: Interviewed,
				color: "#00FFFF",
				name: "Interviewed"
			},{
				type: "line",
				data: Tested,
				color: "#330000",
				name: "Tested"
			},{
				type: "line",
				data: Selected,
				color: "#336600",
				name: "Selected"
			},{
				type: "line",
				data: Rejected,
				color: "#33FF00",
				name: "Rejected"
			},{
				type: "line",
				data: Offered,
				color: "#663333",
				name: "Offered"
			},{
				type: "line",
				data: InterviewCalled,
				color: "#6633CC",
				name: "Interview Called"
			},{
				type: "line",
				data: TestCalled,
				color: "#99FF00",
				name: "Test Called"
			},{
				type: "line",
				data: FinalInterviewCalled,
				color: "#CC9900",
				name: "Final Interview Called"
			},{
				type: "line",
				data: FinalInterviewed,
				color: "#FF0000",
				name: "Final Interviewed"
			},{
				type: "line",
				data: Joined,
				color: "#FFFF00",
				name: "Joined"
			}],
			tooltip: {
                            visible: true
                    },
			categoryAxis: {
				baseUnit: "months",
				categories: dates
			},
			valueAxis: {
				majorUnit: 5,
				min: 0 
			 }
		});
	}

	$(document).ready(function() {
		setTimeout(function() {
			// Initialize the chart with a delay to make sure
			// the initial animation is visible
			createChart();

			$("#example").bind("kendo:skinChange", function(e) {
				createChart();
			});
		}, 400);

		$(".configuration").bind("change", refresh);
	});

	function refresh() {
		var chart = $("#chart").data("kendoChart"),
			series = chart.options.series,
			categoryAxis = chart.options.categoryAxis,
			baseUnitInputs = $("input:radio[name=baseUnit]"),
			aggregateInputs = $("input:radio[name=aggregate]");

		for (var i = 0, length = series.length; i < length; i++) {
			series[i].aggregate = aggregateInputs.filter(":checked").val();
		};

		categoryAxis.baseUnit = baseUnitInputs.filter(":checked").val();

		chart.refresh();
	}
</script>
            <style scoped>
                .chart-wrapper {
                	margin: 27px 0 0 20px;
                	width: 700px;
                	height: 1400px;
                	background: url("../../content/shared/styles/chart-wrapper-small.png") transparent no-repeat 0 0;
                }
                
                .chart-wrapper .k-chart {
                    height: 1300px;
                    padding: 37px;
                    width: 1600px;
                }
            </style>
        </div>

</body>
</html>